<template>
	<view class="container">
		<navbar :config="config" backColor="#000"></navbar>
		<view class="list">
			<radio-group>
				<view class="itemThree"><text>订单号</text></view>
				<text class="itemTwo">{{this.orderCode}}</text>				
			</radio-group>
		</view>
		<view class="add-btn" @click="writeOff()">
			<view>核销订单</view>
		</view>

		<div v-if="visible" class="dialog-overlay" @click.self="close">  
			<div class="dialog">  
			<h3>确认核销订单</h3>  
			<p>您确定要核销这个订单吗？</p>  
			<div class="dialog-buttons">  
				<button @click="confirm">确定</button>  
				<button @click="close">取消</button>  
			</div>  
    </div>  
  </div>  
	</view>
</template>

<script>
	export default {
		props: ['visible'],
		data() {
			return {
				userId:'',
				orderCode:'',
				config: {
					back: true, //false是tolbar页面 是则不写
					title: '订单核销',
					color: '#000',
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					backgroundColor: [1, "#fff"],
					statusBarFontColor: '#1A1A1A',
					backIconColor: "#000"
				},
				bankList: [],
				imgUrl: this.$mConfig.staticUrl
			}
		},
		onLoad(options) {
			this.userId = options.id;
			this.orderCode = options.orderCode;
			console.log(options);
		},
		methods: {
			    confirm() {  
			      this.$emit('confirm');  
			      this.close();  
			    },  
			    close() {  
			      this.$emit('close');  
			    } ,
			//获取地址列表
			async getBankList() {
				let that = this
				this.$http.get('/userbank/list', {}).then(async res => {
					console.log('res', res)
					if (res.code == 200) {
						that.bankList = res.list
					}
				})
			},
			//跳转到添加地址
			writeOff() {
				this.$http.post('/writeOff/set?orderCode=' + this.orderCode + "&" +"userId=" + this.userId).then(async res => {
					if (res && res.code == 200) {
						uni.showToast({
							title: "核销成功",
							icon: "none",
							duration: 3000,
							success() {
							}
						})
					}
				})
			},
			
			
			
			// isDefault(id) {
			// 	let that = this
			// 	this.$http.put('/userbank/set-def/' + id).then(async res => {
			// 		if (res && res.code == 200) {
			// 			uni.showToast({
			// 				title: "修改成功",
			// 				icon: "none",
			// 				duration: 3000,
			// 				success() {
			// 					that.getBankList()
			// 					that.bankList = []
			// 				}
			// 			})
			// 		}
			// 	})

			// },
		}
	}
</script>

<style lang="scss">
	
	.dialog-overlay {  
	  position: fixed;  
	  top: 0;  
	  left: 0;  
	  right: 0;  
	  bottom: 0;  
	  background: rgba(0, 0, 0, 0.5);  
	  display: flex;  
	  justify-content: center;  
	  align-items: center;  
	}  
	
	.dialog {  
	  background: white;  
	  padding: 20px;  
	  border-radius: 5px;  
	}  
	
	.dialog-buttons {  
	  margin-top: 20px;  
	  display: flex;  
	  justify-content: space-between;  
	}  
	page {
		background-color: #F5F5F5;
	}

	.kuang {
		display: flex;
		align-items: center;
	}

	// .list{
	// 	margin-bottom: 160rpx;
	// }
	.item {
		// margin: 30rpx 30rpx 0 30rpx;
		// padding:30rpx 30rpx 46rpx 30rpx;
		// border-radius: 20rpx;
		background-size: 100% 100%;
		width: 673rpx;
		height: 169rpx;
		margin-top: 19rpx;
		margin-left: 38rpx;

		.itemOne {
			font-weight: 500;
			font-size: 33rpx;
			color: #FFFFFF;
			padding-top: 19rpx;
			padding-left: 19rpx;
			line-height: 33rpx;
		}

		.itemTwo {
			font-weight: 400;
			font-size: 23rpx;
			color: rgba(255, 255, 255, 0.9);
			margin-top: 11rpx;
			margin-left: 19rpx;
			line-height: 23rpx;
		}

		.itemThree {
			font-weight: 600;
			font-size: 35rpx;
			color: #FFFFFF;
			margin-left: 19rpx;
			margin-top: 26rpx;
			line-height: 35rpx;

		}

			}

	.add-btn {
		// width: 100%;
		// position: fixed;
		// bottom: 45rpx;
		width: 673rpx;
		height: 96rpx;
		background: #FFFFFF;
		border-radius: 19rpx 19rpx 19rpx 19rpx;
		margin-top: 38rpx;
		margin-left: 38rpx;
		font-weight: 400;
		font-size: 29rpx;
		color: #333333;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		// button {
		// 	width: 100%;
		// }
	}
	.operation {
			width: 634rpx;
			height: 38rpx;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			margin-left: 57rpx;
			margin-top: 23rpx;
	
			.operationOne {
				display: flex;
				flex-direction: row;
				justify-content: flex-start;
				align-items: center;
				width: 300rpx;
				height: 38rpx;
			}
	
			.operationTwo {
				display: flex;
				flex-direction: row;
				justify-content: flex-end;
				align-items: center;
				width: 300rpx;
				height: 38rpx;
				.operationTwo-item{
					font-weight: 400;
					font-size: 23rpx;
					color: #333333;
				}
			}
	
			.whole {
				display: flex;
				align-items: center;
			}
	
			/deep/ .uni-icon-success {
				color: RGB(255,34,32) !important;
			}
	
			.top {
				display: flex;
				align-items: center;
				margin-right: 10rpx;
			}
		}
		.addCard{
			width: 35rpx;
			height: 35rpx;
			margin-right: 11rpx;
		}
		
		
	
</style>